<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>自定义事件</title>
</head>
<body>
<button> 点击获取数据 </button>
<script>
    // const add = new Event('my add function')
    // const oBtn = document.querySelector('button')
    // console.log(oBtn)
    // oBtn.addEventListener('add',function (e){
    //     console.log(e)
    // })


    // 1.
    // let myEvent = new Event('myEvent');
    // 2.
    // let myEvent = new CustomEvent('myEvent', {
    //   detail: {
    //     name: 'lindaidai'
    //   }
    // })
    // 3.
    // let myEvent = document.createEvent('CustomEvent');
    // myEvent.initEvent('myEvent', true, true)

    let btn = document.querySelector('button')
    btn.addEventListener('myEvent', function (e) {
        console.log(e)
        console.log(e.detail)
    })
    setTimeout(() => {
        btn.dispatchEvent(myEvent)
    }, 2000)


</script>
</body>
</html>
